import {getAreaList} from "../../../service/location";

Component({
    options:{
        styleIsolation: 'apply-shared',
    },
    properties: {
        keyCol:{type:String,value:'title'},
        valueCol:{type:String, value:'id'},
        options:{type:Object|Array|null, value:null},
        value:{
            type:Array|String|null, value:'',
            observer(data){
                this.setValue(data)
            }
        },
        placeholder: {type:String, value:"请选择"}
    },
    data: {
        _show:false,
        _value: [],
        _keys:{},
        _options:null,
        _loading:true,
        _twoLoading:false,
        _threeLoading:false,
        _oneIndex:-1,
        _twoIndex:-1,
        _threeIndex:-1,
        _text:'',

    },
    lifetimes:{
        attached() {
            (async ()=>{
                const {keyCol, valueCol, value} = this.data
                const field= {
                    _text:''
                }

                // 获取一级分类
                const options = await getAreaList({pid:1})
                field._options = options
                // 格式化value
                const _value = this._getValue(value)
                if (_value[0]){
                    field._oneIndex = options.findIndex(item => item.id==_value[0])
                    if (field._oneIndex > -1){
                        field._text = options[field._oneIndex].title
                    }

                }
                if (_value[1]){ // 设置二级分类
                    const twoOptions = await getAreaList({pid:_value[0]})
                    field._options[field._oneIndex].children = twoOptions
                    field._twoIndex = twoOptions.findIndex(item => item.id==_value[1])
                    if (field._twoIndex > -1){
                        field._text += " " + twoOptions[field._twoIndex].title
                    }
                }
                if (_value[2]){ // 设置三级分类
                    const threeOptions = await getAreaList({pid:_value[1]})
                    field._options[field._oneIndex].children[field._twoIndex].children = threeOptions
                    field._threeIndex = threeOptions.findIndex(item => item.id == _value[2])
                    if (field._threeIndex > -1){
                        field._text += " " + threeOptions[field._threeIndex].title
                    }
                }

                this.setData({
                    ...field,
                    _loading:false,
                })

            })()
        }
    },
    methods: {
        pickerClick(){
          this.setData({
              _show:true,
          })
        },
        async oneClick(e){
            const {id} = e.currentTarget.dataset
            const {_options} = this.data
            const index = _options.findIndex(item => item.id == id)

            if (!_options[index].children){
                this.setData({
                    _twoLoading:true,
                })
                const r = await getAreaList({pid:id})
                this.setData({
                    [`_options[${index}].children`]:r,
                    _twoLoading: false,
                })
            }

            this.setData({
                _value:[id,0,0],
                _oneIndex:index,
            })

        },
        async twoClick(e){

            const {id} = e.currentTarget.dataset
            const {_options,_oneIndex,_value} = this.data
            const index = _options[_oneIndex].children.findIndex(item => item.id == id)

            if (!_options[_oneIndex].children[index].children){
                this.setData({
                    _threeLoading:true,
                })
                const r = await getAreaList({pid:id})

                this.setData({
                    [`_options[${_oneIndex}].children[${index}].children`]:r,
                    _threeLoading: false,
                })
            }

            _value[1] = id
            _value[2] = 0
            this.setData({
                _value,
                _twoIndex:index,
            })

        },
        threeClick(e){
            const {id} = e.currentTarget.dataset
            const {_options,_oneIndex, _twoIndex} = this.data
            const index = _options[_oneIndex].children[_twoIndex].children.findIndex(item => item.id == id)

            this.setData({
                [`_value[2]`]:id,
                _threeIndex: index,
            })
        },

        submit(){
            const {_value, _options, _oneIndex,_twoIndex,_threeIndex} = this.data
            let text = ''
            if (_value[0]){
                text = _options[_oneIndex].title
            }
            if (_value[1]){
                text += " " + _options[_oneIndex].children[_twoIndex].title
            }
            if (_value[2]){
                text += " " + _options[_oneIndex].children[_twoIndex].children[_threeIndex].title
            }

            this.setData({
                _show:false,
                _text:text,
            })

            this.triggerEvent("confirm", {
                value:_value
            })
        },
        async _getValue(data){

            let _value = data
            if (!data){
                _value = []
            }
            else if (typeof data == 'string'){
                _value = data.split(',')
            }
            console.log("_value", _value)

            return _value

        }
    }
});
